﻿<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<meta name="apple-itunes-app" content="app-id=591578609">
	<meta name="viewport" content="width=device-width"/>
	<meta name="description" content="筑学堂网校" />
	<script type="text/javascript">
		 //首页
	   function firstPage(){
		  $.ajax({ url: "query_homeGroup_topic/1/${pageSize}", 
			       success: function(result){
		              $("#tab3").html(result);
		           }
		  });
		}
	 //上一页
	   function upPage(){
		      var pageNo = '${pageNo}';
		      var upNo = Number(pageNo) - 1 ;
		      if(Number(pageNo)>1){
		    	  $.ajax({ url: "query_homeGroup_topic/"+upNo+"/${pageSize}", 
				       success: function(result){
			              $("#tab3").html(result);
			           }
			     });
		      }
			  
		}
	   //下一页
	   function nextPage(){
		      var pageNo = '${pageNo}';
		      var sumPageNum = '${sumPageNum}';
		      var nextNo = Number(pageNo) + 1 ;
		      if(Number(pageNo)<Number(sumPageNum)){
		    	  $.ajax({ url: "query_homeGroup_topic/"+nextNo+"/${pageSize}", 
				       success: function(result){
			              $("#tab3").html(result);
			           }
			     });
		      }
		}
	   //跳转页
	   function gotoPage(obj){
		      var pageNo = $(obj).val();
			  $.ajax({ url: "query_homeGroup_topic/"+pageNo+"/${pageSize}", 
				       success: function(result){
			              $("#tab3").html(result);
			           }
			  });
		}
	   
	   function topicDetail(group_id,topic_id){
		   window.open('query_group_main/'+group_id+"?flag=topic&topicId="+topic_id,'_blank');
		   
	   }
	</script>
</head>

<body style="clear:both;align:center;">
	<!--热门群组-->
	<div id="tab1" class="home_hy_div02" style="display:block;">
		<div class="ms_tab1_text01">&nbsp;</div>
		<div class="home_qz_divl">

			<table width="1000px" align="center">
				<tr style="background-color:#B3DDDF;text-align:center;height:30px;border-bottom:1px solid #DDD;">
					<td width="10px"> </td>
					<td width="400px" style="font-size:14px;">话&nbsp;&nbsp;&nbsp;&nbsp;题 </td>
					<td width="200px" style="font-size:14px;">群&nbsp;&nbsp;&nbsp;&nbsp;组 </td>
					<td width="90px" style="font-size:14px;">作&nbsp;&nbsp;&nbsp;&nbsp;者 </td>
					<td width="90px" style="font-size:14px;">浏&nbsp;&nbsp;&nbsp;&nbsp;览 </td>
					<td width="90px" style="font-size:14px;">回&nbsp;&nbsp;&nbsp;&nbsp;复 </td>
					<td width="90px" style="font-size:14px;">最新回复 </td>
				</tr>
				 <c:forEach items="${data.data}" var="li" varStatus="item">
				 	<tr style="text-align:center;height:30px;border-bottom:1px solid #DDD;">
					 	<td width="10px"> </td>
						<td width="400px" style="font-size:14px;"><a  href="#" style="cursor: pointer;" onclick="topicDetail('${li.group_id}','${li.id}')">${li.topic_nm}</a> </td>
						<td width="200px" style="font-size:14px;">${li.group_nm}</td>
						<td width="90px" style="font-size:14px;">${li.create_nm} </td>
						<td width="90px" style="font-size:14px;">${li.view_cnt} </td>
						<td width="90px" style="font-size:14px;">${li.reply_cnt} </td>
						<td width="90px" style="font-size:14px;">${li.last_reply_nm} </td>
				 	</tr>
				 </c:forEach>
			</table>
		 </div>
	 </div>
	 <div class="home_qz_div00"> </div>
			
		
		<!--页面切换-->
		<div class="page_div">
			<div class="page_body">
			    <a href="#"> 
			      <div class="kczx_divlb01" onclick="firstPage()" >首&nbsp;页</div>
				</a>
				
				<div class="kczx_divlb02"></div>
				
				<a href="#">
				  <div class="kczx_divlb01" onclick="upPage()" >上一页</div>
				</a>
				
				<div class="kczx_divlb02"></div>
				
				<a href="#">
				 <div class="kczx_divlb01" onclick="nextPage()" >下一页</div>
				</a>
				
				<div class="kczx_divlb02"></div>
				<select class="kczx_divlb01 page_select" onchange="gotoPage(this)" id="hostSelect">
				    <c:forEach begin="1" end="${sumPageNum}" var="i">  
					     <option value="${i}" <c:if test="${pageNo == i}"> selected="selected" </c:if>  >
					        第${i}页
					     </option>
				     </c:forEach> 
				</select>
			</div>
		</div>
		<!--end页面切换--> 
		
	
</body>
</html>